<%@ page language="java" contentType="text/html; charset=UTF-8"
	pageEncoding="UTF-8"%>

<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core"%>
<%@ taglib uri="http://java.sun.com/jsp/jstl/fmt" prefix="fmt" %>
<%
    String path = request.getContextPath(); 
	String basePath = request.getScheme() + "://"
			+ request.getServerName() + ":" + request.getServerPort()
			+path+ "/"; 
	

%>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
 <base href="<%=basePath%>">

<style type="text/css">
a{ text-decoration:none;}
a:hover{ text-decoration:none;}
.tcdPageCode{padding: 15px 20px;text-align: left;color: #ccc;text-align:center;}
.tcdPageCode a{display: inline-block;color: #428bca;display: inline-block;height: 25px;	line-height: 25px;	padding: 0 10px;border: 1px solid #ddd;	margin: 0 2px;border-radius: 4px;vertical-align: middle;}
.tcdPageCode a:hover{text-decoration: none;border: 1px solid #428bca;}
.tcdPageCode span.current{display: inline-block;height: 25px;line-height: 25px;padding: 0 10px;margin: 0 2px;color: #fff;background-color: #428bca;	border: 1px solid #428bca;border-radius: 4px;vertical-align: middle;}
.tcdPageCode span.disabled{	display: inline-block;height: 25px;line-height: 25px;padding: 0 10px;margin: 0 2px;	color: #bfbfbf;background: #f2f2f2;border: 1px solid #bfbfbf;border-radius: 4px;vertical-align: middle;}
.one{display: none ;}
#dt {
	margin: 30px auto;
	height: 28px;
	width: 200px;
	padding: 0 6px;
	border: 1px solid #ccc;
	outline: none;
}
#confirm{
  width: 250px;
  height: 40px;
  margin-left: 15%;
  margin-top:40px;
  text-align: center;
  
 }
 .imgitem {
  width: 240px;
  height: 160px;
  display: inline-block;
  border: 1px #d5d4d4 dotted;
  text-align: center;
  line-height: 160px;
  position: relative;//相对定位
  
  }
 .u-fileInput{
  width: 240px;
  height: 160px;
  overflow: hidden;
  position: absolute;
  right: 0;
  top: 0;
  padding-left:10px;
  opacity: 0;//透明度为0
  filter: alpha(opacity=0);;//透明度为0，兼容IE8
  cursor: pointer;
  }
   //add-img图标
  .u-add-img-icon {
  width: 74px;
  height: 61px;
/*    background: url() no-repeat;  */
  display: inline-block;
  vertical-align: middle;
  } 
  #fileImg{
   width: 240px;
  height: 160px;
  }
  .form-group span{
  	margin-right:15px;
  } 
</style>
	<meta charset="utf-8">

     <link href="https://cdn.bootcss.com/bootstrap-fileinput/4.3.8/css/fileinput.min.css" rel="stylesheet">

    <script src="js/jquery-1.9.1.js" type="text/javascript" charset="utf-8"></script>
    <script type="text/javascript"  src="bootstrap-fileinput/js/fileinput.min.js" ></script>
    <script src="bootstrap-fileinput/js/plugins/canvas-to-blob.js"></script>
    <script src="https://cdn.bootcss.com/bootstrap-fileinput/4.3.1/js/fileinput_locale_zh.js"></script>
    <link href="http://cdn.bootcss.com/bootstrap/3.3.6/css/bootstrap.min.css" rel="stylesheet">
     <script src="assets/js/bootstrap.min.js"></script>
     <script src="js/xcConfirm.js" type="text/javascript" charset="utf-8"></script>
     <link rel="stylesheet" type="text/css" href="css/xcConfirm.css"/>
     <script type="text/javascript" src="UEditor/ueditor.config.js"></script>  
      <script type="text/javascript" src="UEditor/ueditor.all.js"></script>  
      <link rel="stylesheet" href="UEditor/themes/default/css/ueditor.css"> 
     <script type="text/javascript" src="assets/jedate/jquery.jedate.js"></script>
     <link type="text/css" rel="stylesheet" href="assets/jedate/skin/jedate.css">
       <link rel="stylesheet" type="text/css" href="css/xcConfirm.css"/>
     <script src="js/xcConfirm.js" type="text/javascript" charset="utf-8"></script>





<body style="padding: 40px 40px">
<div>
	<form class="form-horizontal" role="form" >   
	<div class="table-responsive" style="padding: 20px 20px;overflow-x:hidden;">
		<input type="hidden" name="id" />
		<div class="form-group">
			 <label for="firstname" class="col-sm-2 control-label">账户名称</label>
			 <div class="col-sm-3">
     		 	<input type="text" class="form-control" name="empAccount" id="empAccount"  placeholder="请输入有效邮箱" value="${result.empAccount}">
     		 </div>
    	</div>
    	<div class="form-group">
			 <label for="firstname" class="col-sm-2 control-label">账户编号</label>
			 <div class="col-sm-3">
     		 	<input type="text" class="form-control" name="empNo" id="empNo"  placeholder="请输入账户编号" value="${result.empNo} ">
     		 </div>
    	</div>
    	<%-- <div class="form-group">
			 <label for="firstname" class="col-sm-2 control-label">员工门店</label>
			 <div class="col-sm-3">
     		 	<input type="text" class="form-control" name="empVenues" id="empVenues" value="${result.empVenues}" placeholder="请输入门店信息">
     		 </div>
    	</div> --%>
    	<!-- <div class="form-group">
    	 <label for="firstname" class="col-sm-2 control-label">员工门店</label>
             <div style="display:inline;margin-left:10px;">
               <select    id="provinces" style="width: 100px;height: 35px" onchange="province()" > 
                        <option value="">--全部--</option>
               </select> 
                     <span>  省  </span>  
           
             <select name="citys" id="citys" onchange="city()" style="width: 100px;height: 35px" > 
                <option value="">--全部--</option>
             </select>    
                       <span>市 </span>  
          
		     <select name="countys" id="countys" style="width: 100px;height: 35px" > 
                <option value="">--全部--</option>
             </select>  
             <select name="empVenues" id="empVenues" style="width: 100px;height: 35px" > 
                <option value="">--总部--</option>
             </select>  
             </div>
  		</div> -->
    	<div class="form-group">
			 <label for="firstname" class="col-sm-2 control-label">员工姓名</label>
			 <div class="col-sm-3">
     		 	<input type="text" class="form-control" name="empName" id="empName"  placeholder="请输入员工姓名"  value="${result.empName} ">
     		 </div>
    	</div>
    	<%-- <div class="form-group">
			 <label for="firstname" class="col-sm-2 control-label">员工头像</label>
			 <div class="col-sm-3">
     		 	<input type="text" class="form-control" name="empImg" id="empImg" value="${result.empImg}" placeholder="请选择员工头像">
     		 </div>
    	</div> --%>
	    	<div class="form-group">
    <label for="lastname" class="col-sm-2 control-label">员工头像</label>
    <div class="col-sm-3">
		<input id="input-21" type="file" accept="image/*" class="file-loading">
		<input type="hidden"  id="imgId">
		<input type="hidden"  id="initId" value="${result.empImg}">
		<script>
		$(document).on('ready', function() {
		    $("#input-21").fileinput({
		         previewFileType: "image", 
		        browseClass: "btn btn-success",
		        browseLabel: "请选择",
		        browseIcon: "<i class=\"glyphicon glyphicon-picture\"></i> ",
		        removeClass: "btn btn-danger",
		        removeLabel: "删除",
		        removeIcon: "<i class=\"glyphicon glyphicon-trash\"></i> ",
		        uploadClass: "btn btn-info",
		        uploadLabel: "上传",
		        uploadIcon: "<i class=\"glyphicon glyphicon-upload\"></i> ", 
		         uploadUrl: "<%=basePath%>pcphoto/pcphoto",
		        allowedFileExtensions: ["jpg", "png", "gif"],
		        initialPreview: [
		                         '<img src="${result.empImg}"  id="img"  class="file-preview-image"  width="256px" height="160px" />',
		                     ],
		        maxImageHeight: 150,
		        maxFileCount: 1,
		        resizeImage: true
		        	}).on('filepreupload', function(data) {
		                console.log(data);
		        	    $('#kv-success-box').html('');
		        	}).on('fileuploaded', function(event, data) {
		        		 if(data.response.code==200){
		        				$("#imgId").val(data.response.data);       
		        		 }else{
		        			 var txt=data.response.msg;
       					  window.wxc.xcConfirm(txt, window.wxc.xcConfirm.typeEnum.info);
		        			 
		        		 }
		        	    $('#kv-success-box').append(data.response.link);
		        	    $('#kv-success-modal').modal('show');
		        	}).on('fileclear', function(event, key) {  
		        	       alert("图片被移除");
		        	      $("#imgId").val(null); 
		        	});
		        	
		        	
		    });
	
		</script>
  </div>
  </div> 
    	<div class="form-group">
			 <label for="firstname" class="col-sm-2 control-label">工号</label>
			 <div class="col-sm-3">
     		 	<input type="text" class="form-control" name="empNumber" id="empNumber"  placeholder="请输入员工工号" value="${result.empNumber}">
     		 </div>
    	</div>
<%--     	<div class="form-group">
			 <label for="firstname" class="col-sm-2 control-label">密码</label>
			 <div class="col-sm-3">
     		 	<input type="password" class="form-control" name="empPwd" id="empPwd" placeholder="请输入密码" ${data.empPwd}>
     		 </div>
    	</div>
    	<div class="form-group">
			 <label for="firstname" class="col-sm-2 control-label">确认密码</label>
			 <div class="col-sm-3">
     		 	<input type="password" class="form-control" name ="newEmpPwd" id="newEmpPwd"  placeholder="请输入确认密码" >
     		 </div>
    	</div> --%>
       <div class="form-group">
           <div style="display:inline;margin-left:10px;">
			 <label for="firstname" class="col-sm-2 control-label">账号等级</label>
    	 <select    id="grade"     style="width: 200px;height: 35px"  > 
                        <option value="0">运营部门</option>
                        <option value="1">门店</option>
         </select> 
               </div>
    	 </div>
         <div class="form-group">
           <div style="display:inline;margin-left:10px;">
			 <label for="firstname" class="col-sm-2 control-label">员工角色配置</label>
    	 <select    id="empe"  onchange="empRole1111()"    style="width: 200px;height: 35px"  > 
                        <option value="0">超级管理员</option>
                        <option value="1">普通员工</option>
         </select> 
               </div>
    	 </div>
    	 
    	 <script type="text/javascript">

			   	  function  empRole1111() {
			   		          
			   	   var  emp_role = $("#empe").find("option:selected").val();
			   	   if(emp_role==0){
			   		          $("#Authority").css("display","none");		                  
			   	   }else(emp_role==1){
			   		          $("#Authority").css("display","block");	
			   	   }
			   	}   
    	 
    	 </script>
    	 <div id="Authority" style="display: none">
    	<div class="form-group">
			 <label for="firstname" class="col-sm-2 control-label">账号权限</label>
			 <div class="col-sm-3" style="width:75%">
			 	<table class="table">
					<thead>
						<tr>
							<th style="width:15%">父级菜单</th>
							<th>子级菜单</th>
						</tr>
					</thead>
					<tbody>
						<tr>
							<td><input id="product"  type="checkbox" name="check_name"  value="1">产品管理</td>
							<td>
								<span><input class="product" type="checkbox" name="check_name"  value="8">课程管理</span>
							</td>
							<td>
								<span><input class="product" type="checkbox" name="check_name"  value="9">新建课程</span>
							</td>
							<td>
								<span><input class="product" type="checkbox" name="check_name"  value="10">课程类别管理</span>
							</td>
							<td>
								<span><input class="product" type="checkbox" name="check_name"  value="11">场馆管理</span>
							</td>
						     <td>
								<span><input class="product" type="checkbox" name="check_name"  value="12">新建场馆</span>
							</td>
							<td>
								<span><input class="product" type="checkbox" name="check_name"  value="13">团建管理</span>
							</td>
							<td>
								<span><input class="product" type="checkbox" name="check_name"  value="14">编辑团建</span>
							</td>
							<td>
								<span><input class="product" type="checkbox" name="check_name"  value="15">团建折扣管理</span>
							</td>
						</tr>
						<tr>
							<td><input id="marketing" type="checkbox" name="check_name"  value="2">营销管理</td>
							<td>
								<span><input class="marketing" type="checkbox" name="check_name"  value="16">广告管理</span>
							</td>
							<td>
								<span><input class="marketing" type="checkbox" name="check_name"  value="17">首页推荐管理</span>
							</td>
							<td>
								<span><input class="marketing" type="checkbox" name="check_name"  value="18">优惠券管理</span>
							</td>
							<td>
								<span><input class="marketing" type="checkbox" name="check_name"  value="19">活动管理</span>
							</td>
							<td>
								<span><input class="marketing" type="checkbox" name="check_name"  value="20">团建广告管理</span>
							</td>
						</tr>
						<tr>
							<td><input id="order" type="checkbox" name="check_name"  value="3">订单管理</td>
							<td>
								<span><input class="order" type="checkbox" name="check_name"  value="21">订单管理</span>
							</td>
							<td>
								<span><input class="order" type="checkbox" name="check_name"  value="22">团建订单</span>
							</td>
							<td>
								<span><input class="order" type="checkbox" name="check_name"  value="23">预约核销</span>
							</td>
							<td colspan="2">
								<span><input class="order" type="checkbox" name="check_name"  value="24">核销信息</span>
							</td>
						</tr>
						<tr>
							<td><input id="system" type="checkbox" name="check_name"  value="5">系统管理</td>
							<td>
								<span><input class="system" type="checkbox" name="check_name"  value="27">定制团建信息管理</span>
							</td>
							<td>
								<span><input class="system" type="checkbox" name="check_name"  value="28">作品管理</span>
							</td>
							<td>
								<span><input class="system" type="checkbox" name="check_name"  value="29">意见反馈</span>
							</td>
							<td colspan="2">
								<span><input class="system" type="checkbox" name="check_name"  value="30">公司简介</span>
							</td>
						</tr>
						<tr>
							<td><input id="appointment" type="checkbox" name="check_name"  value="4">预约管理</td>
							<td>
								<span><input class="appointment" type="checkbox" name="check_name"  value="25">今日预约信息</span>
							</td>
							<td colspan="4">
								<span><input class="appointment" type="checkbox" name="check_name"  value="26">所有预约信息</span>
							</td>
						</tr>
						<tr>
							<td><input id="member" type="checkbox" name="check_name"  value="6">会员管理</td>
							<td>
								<span><input class="member" type="checkbox" name="check_name"  value="31">会员管理</span>
								
							</td>
							<td colspan="3">
								<span><input class="member" type="checkbox" name="check_name"  value="32">新建会员</span>
							</td>							
						</tr>
						<tr>
							<td><input id="account" type="checkbox" name="check_name"  value="7">账户管理</td>
							<td>
								<span><input class="account" type="checkbox" name="check_name"  value="33">账户管理</span>
							</td>
							<td colspan="4" >
								<span><input class="account" type="checkbox" name="check_name"  value="34">新建账户</span>
							</td>
						</tr>
					</tbody>
					</table>
     		 </div>
    	</div>
	</div>
	</div>
	</form>
	<button type="button"  class="btn btn-primary btn-lg" id="submitEmp" onclick="confirmFavorable()" style="margin-left:20%">提交</button>
</div>
	<script type="text/javascript">
	$(function(){
		  //  得到员工ｉｄ　展示数据
		 initData();
		 initauth(); 
	});
	
	
	//提交
	$("#submitEmp").click(function(){
		var path = "";		
		var empAccount = $("#empAccount").val();
		var empNo = $("#empNo").val();
		var empVenues = $("#empVenues").val();
		var empName = $("#empName").val();
		var initId = $("#initId").val();
		var empNumber = $("#empNumber").val();
		var imgId   =$("#imgId").val();		 
		var grade = $("#grade").find("option:selected").val();
	  	var  emp_role = $("#empe").find("option:selected").val();		
		  var checkArray  =  $("input:checkbox[name='check_name']:checked");					  		  
		        var str =" ";
	            for (var i = 0; i < checkArray.length; i++) {
	             str+=  checkArray[i].value+","		                        	 
		    } 
	            if(str==null){
			    	 str ="hello";
			     }
		// 判断用户是否更新了照片 
		   var empImg = " ";
		  if(imgId==null||imgId==""){
			  empImg = initId;  
          }else{
        	  empImg = imgId;
          }
		
			path ="bsEmployee/editEmployee";
			$.ajax({
				type:"POST",
				url:path,
				contentType:"application/json;charset=UTF-8",
				data: JSON.stringify({
					"empAccount":empAccount,
					"empNo":empNo,	
					"empVenues":empVenues,
					"empName":empName,
					"empImg":empImg,
					"empNumber":empNumber,
					"empGrade":grade,
					"empRole":emp_role,
					"str":str,
					"empId":'${result.empId}'
				}),
				dataType:"json",
				success:function(data){
					console.log(data);
					if(data.code==200){
						  window.location.href="employee/index.jsp";  
        	       }else{   
        	    	   window.wxc.xcConfirm(data.msg, window.wxc.xcConfirm.typeEnum.info);
        	       }
				}
			}) 
			
	 	
	});

	//产品管理全选
	$("#product").click(function(){
		 if($(this).is(':checked')){
			$(".product").each(function(){
				$(this).prop("checked",true);
			})
		}else{
			$(".product").each(function(){
				$(this).prop("checked",false);
			})
		} 
	})
	//营销管理
	$("#marketing").click(function(){
		if($(this).is(':checked')){
			$(".marketing").each(function(){
				$(this).prop("checked",true);
			})
		}else{
			$(".marketing").each(function(){
				$(this).prop("checked",false);
			})
		}
	})
	//订单管理
	$("#order").click(function(){
		if($(this).is(':checked')){
			$(".order").each(function(){
				$(this).prop("checked",true);
			})
		}else{
			$(".order").each(function(){
				$(this).prop("checked",false);
			})
		}
	})
	//系统管理
	$("#system").click(function(){
		if($(this).is(':checked')){
			$(".system").each(function(){
				$(this).prop("checked",true);
			})
		}else{
			$(".system").each(function(){
				$(this).prop("checked",false);
			})
		}
	})
	//预约管理
	$("#appointment").click(function(){
		if($(this).is(':checked')){
			$(".appointment").each(function(){
				$(this).prop("checked",true);
			})
		}else{
			$(".appointment").each(function(){
				$(this).prop("checked",false);
			})
		}
	})
	//会员管理
	$("#member").click(function(){
		if($(this).is(':checked')){
			$(".member").each(function(){
				$(this).prop("checked",true);
			})
		}else{
			$(".member").each(function(){
				$(this).prop("checked",false);
			})
		}
	})
	//账号管理
	$("#account").click(function(){
		if($(this).is(':checked')){
			$(".account").each(function(){
				$(this).prop("checked",true);
			})
		}else{
			$(".account").each(function(){
				$(this).prop("checked",false);
			})
		}
	})
	
     
	     function  initData(){	
           // 员工等级 select
		         var   grade = ${result.empGrade} ;
		
		       var options = document.getElementById("grade").options;
 
	             for( var i=0; i< options.length;i++){
	            	       
			             if (options[i].value == grade)
			             {
			              options[i].selected = true;
			             }
			        } ;
		   // 员工角色 select	        
			        var   empRole = "${result.empRole}";  
			        var options = document.getElementById("empe").options;
			        
		             for( var i=0; i< options.length;i++){
		            	       
				             if (options[i].value == empRole)
				             {
				              options[i].selected = true;
				             }
				        }   
			     
				       if(empRole==1){
                          $("#Authority").css("display","block");		                  
					   }else if(empRole==0){
					       $("#Authority").css("display","none");	
					   }
				       
						/*   var checkArray  =  $("input:checkbox[name='check_name']:checked");					  		  
						        var str =" ";
					            for (var i = 0; i < checkArray.length; i++) {
					             str+=  checkArray[i].value+","		                        	 
						    }  */
				       }   
	
                 //初始化权限数据
	             function initauth (){	    
	            	 $.ajax({
	     				type:"get",
	     				url:"bsEmployee/empauth",
	     				contentType:"application/json;charset=UTF-8", 
	     				data:{"empId":'${result.empId}'},
	     				dataType:"json",
	     				success:function(data){
	     				   console.log(data);
	     					    if(data.code==200){
	     					  	 var radioAll  = $("input[name='check_name']");  
	     					  	 for (var i = 0; i < data.data.length; i++) {
							            var authId =   data.data[i].authId ;    
			     					  	for(var a=0 ; a<radioAll.length ;a++){
			     						    var radoiVal = radioAll.eq(a).val();  
				   				    		    if(radoiVal == authId) {
				   				    		        radioAll.get(a).checked = true;
				   				    		    }
				   				    		}
			     					  	}
	     					       }
	                         }	  		
	            	 });
                 }
	</script>
</body>